/**custom**/

@layout: ~"@{css-prefix}layout";
@header: ~"@{css-prefix}header";
@content: ~"@{css-prefix}content";
@footer: ~"@{css-prefix}footer";
@article: ~"@{css-prefix}article";


.@{layout} {
    display: flex;
    height: 100%;
    flex: auto;
    flex-direction: column;
}

.flex-r {
    flex-direction: row;
}

.@{header} {
    height: @default-header-ht;
    flex: 0 0 auto;
}

.@{content} {
    flex: auto;
}

.@{footer} {
    flex: 0 0 auto;
    height: @default-footer-ht;
}

.@{article} {
    flex: 0 0 @default-articl-wd;
}